<!DOCTYPE HTML>
<html>
<head>
    <title>Cocos2d-HTML5</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="icon"
          type="image/GIF"
          href="app/res/favicon.ico"/>
    <link href='http://fonts.googleapis.com/css?family=Nunito:700,300' rel='stylesheet' type='text/css'>
    <style type="text/css">
        body {
            margin: 0;
            padding: 0 20px;
            font-family: 'Nunito', sans-serif;
            font-weight: 300;
        }

        H1 {
            font-size: 68px;
            font-weight: 700;
            background: -webkit-gradient(linear, left top, left bottom, from(#29c9e2), to(#115e8b));
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-family: impact;
        }

        ol {
            font-size: 18px;
        }

        a:visited {
            color: #2c4676;
        }

        a {
            color: #1c8eb2;
        }

        a:hover {
            color: #29c9e2;
        }

        .comment {
            color: #4b4b4b;
        }

        #animated_div {
            width: 200px;
            height: 370px;
            color:#ffffff;
            position:relative;
            font-weight:bold;
            font-size:20px;
            padding:10px;
            animation:animated_div 5s 1;
            -webkit-animation:animated_div 5s 1;
            -moz-animation:animated_div 5s 1;
            border-radius:5px;
            -webkit-border-radius:5px;
        }

        @keyframes animated_div {
            0%      {transform: rotate(0deg);left:0px;}
            25%     {transform: rotate(20deg);left:0px;}
            50%     {transform: rotate(0deg);left:500px;}
            55%     {transform: rotate(0deg);left:500px;}
            70%     {transform: rotate(0deg);left:500px;}
            100%    {transform: rotate(-360deg);left:0px;}
        }

        @-webkit-keyframes animated_div {
            0%      {-webkit-transform: rotate(0deg);left:0px;}
            25%     {-webkit-transform: rotate(20deg);left:0px;}
            50%     {-webkit-transform: rotate(0deg);left:500px;}
            55%     {-webkit-transform: rotate(0deg);left:500px;}
            70%     {-webkit-transform: rotate(0deg);left:500px;}
            100%    {-webkit-transform: rotate(-360deg);left:0px;}
        }

        @-moz-keyframes animated_div {
            0%      {-moz-transform: rotate(0deg);left:0px;}
            25%     {-moz-transform: rotate(20deg);left:0px;}
            50%     {-moz-transform: rotate(0deg);left:500px;}
            55%     {-moz-transform: rotate(0deg);left:500px;}
            70%     {-moz-transform: rotate(0deg);left:500px;}
            100%    {-moz-transform: rotate(-360deg);left:0px;}
        }
    </style>
</head>
<body style="background: #f2f6f8;">
<div id="animated_div">
    <h1><a href="index.html"><img src="app/res/riha-devil2.png"/></a>
    </h1>
</div>
<hr/>
    <li><a href="app/index.html">Intern Adventure</a>
<hr/>

</body>
</html>
